
@function breakpoint-width($name, $breakpoints: $responsive-breakpoints) {
    @return map-get($breakpoints, $name);
}
@function is-name-in-breakpoints($responsive-name,$responsive-names: map-keys($breakpoints)) {
    $n: index($responsive-names, $name);
    @return $n != null;
}

@mixin media-breakpoint-up($name, $width) {
    @if $width != null {
        @media (min-width: $width) {
            @content;
        }
    } @else {
        @content;
    }
}

@mixin media-breakpoint-down($name, $width) {
    @if $width != null {
        @media (max-width: $width) {
            @content;
        }
    } @else {
        @content;
    }
}

@mixin media-breakpoint($name, $width, $type: $responsive-type) {
    @if $type == "up" {
        @include media-breakpoint-up($name, $width) {
            @content;
        }
    } @else if $type == "down" {
        @include media-breakpoint-down($name, $width) {
            @content;
        }
    }
}

@mixin build-responsive-always-up($responsive-names: map-keys($responsive-breakpoints)) {
    @if $responsive-type == "up" {
        @each $name, $width in $responsive-breakpoints {
            @if $width != null {
                @media (min-width: $width) {
                    @content($name, $width);
                }
            } @else {
                @content($name, $width);
            }
        }
    } @else if $responsive-type == "down" {
        @each $name, $width in $responsive-breakpoints {
            $n: index($responsive-names, $name);
            $prev-width: if($n - 1 != 0, map-get($responsive-breakpoints, nth($responsive-names, $n - 1)), null);
            @if $prev-width != null {
                @media (min-width: $prev-width + 1) {
                    @content($name, $prev-width + 1);
                }
            } @else {
                @content($name, $prev-width + 1);
            }
        }
    }
}

@mixin build-responsive-always-down($responsive-names: map-keys($responsive-breakpoints)) {
    @if $responsive-type == "up" {
        @each $name, $width in $responsive-breakpoints {
            $n: index($responsive-names, $name);
            $next-width: if($n + 1 != length($responsive-names) + 1, map-get($responsive-breakpoints, nth($responsive-names, $n + 1)), null);
            @if $next-width != null {
                @media (max-width: $next-width - 1) {
                    @content($name, $next-width - 1);
                }
            } @else {
                @content($name, $next-width - 1);
            }
        }
    } @else if $responsive-type == "down" {
        @each $name, $width in $responsive-breakpoints {
            @if $width != null {
                @media (max-width: $width) {
                    @content($name, $width);
                }
            } @else {
                @content($name, $width);
            }
        }
    }
}

@mixin build-responsive($responsive-names: null) {
    @if $responsive-names != null {
        @if type-of($responsive-names) == "string" {
            $name: $responsive-names;
            @if is-name-in-breakpoints($name) {
                @error "Your passed an invalid responsive breakpoint name: #{$responsive-names}"
            }
            $width: breakpoint-width($name);
            @include media-breakpoint($name, $width) {
                @content($name, $width);
            }

        } @else if type-of($responsive-names) == "list" {
            @each $name in $responsive-names {
                @if is-name-in-breakpoints($name) {
                    @error "Your passed invalid responsive breakpoint names: #{$responsive-names}"
                }
                $width: breakpoint-width($name);
                @include media-breakpoint($name, $width) {
                    @content($name, $width);
                }
            }
        }
    } @else {
        @each $name, $width in $responsive-breakpoints {
            @include media-breakpoint($name, $width) {
                @content($name, $width);
            }
        }
    }
}

@mixin preload-responsive() {
    @each $name, $width in $responsive-breakpoints {
        @content($name, $width);
    }
}
